<template>
  <div>
    <h3>我的工作证明</h3>
    <el-table :data="orgs" style="width: 100%; margin-top: 10px;">
      <el-table-column prop="name" label="组织名称">
        <template #default="scope">
          <el-link type="primary" @click="goDetail(scope.row)">{{ scope.row.name }}</el-link>
        </template>
      </el-table-column>
      <el-table-column prop="orgId" label="组织ID" width="120" />
      <el-table-column prop="email" label="邮箱" />
    </el-table>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage } from 'element-plus'
import axios from 'axios'

const router = useRouter()
const stuId = localStorage.getItem('loginId')
const orgs = ref([])

const fetchWorkingProve = async () => {
  try {
    const res = await axios.get(`http://localhost:8080/student/${stuId}/getWorkingProve`)
    if (res.data && res.data.code === 200) {
      orgs.value = res.data.data || []
    } else {
      orgs.value = []
      ElMessage.error(res.data && res.data.msg ? res.data.msg : '获取工作证明失败')
    }
  } catch (e) {
    ElMessage.error('获取工作证明失败')
  }
}

const goDetail = (row) => {
  // 跳转到组织详情页，传递组织名参数
  router.push({ name: 'StuOrgDetails', params: { orgName: row.name } })
}

onMounted(fetchWorkingProve)
</script>